<template>
  <div id="UserNotice">
    <a-tab-pane class="customTabPane" title="用户须知">
      <a-card v-if="notice" :title="notice.title" class="centerCard">
        <MdView :value="notice.content || ''" class="customContent" />
      </a-card>
    </a-tab-pane>
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";

import MdView from "@/components/MdView.vue";
import { NoticeVO } from "@/views/Home/NoticeVO";

const notice = ref<NoticeVO>();
// 直接给notice赋值
notice.value = {
  title: "用户须知",
  content:
    "### 一、主要内容\n" +
    "\n" +
    "1、用户需要先进行**登录**才可开始做题（如果还没有账号，请先**注册**，注册规则详见附录）。\n" +
    "\n" +
    "2、普通用户的**权限有限**，不可对自己创建之外的帖子，题目进行修改或删除，如有疑问，请联系**管理员**。\n" +
    "\n" +
    "3、用户可在页面右上角“搜索”功能进行聚合搜索，包括本站的题目，帖子，用户以及Arco Design官方提供的图片\n" +
    "\n" +
    "### 二、附录\n" +
    "\n" +
    "![](https://oj-1324519440.cos.ap-beijing.myqcloud.com/%E4%B8%BB%E9%A1%B5%E5%85%AC%E5%91%8A%2F%E6%A0%A1%E9%AA%8C%E8%A7%84%E5%88%99.png)\n" +
    "\n",
};
</script>

<style>
#UserNotice {
  max-width: 1200px;
  margin: 0 auto;
}
.centerCard {
  font-size: 18px; /* 调整内容文字大小为16px */
}
.customContent {
  font-size: 18px; /* 调整内容文字大小为16px */
}

#viewQuestionView .arco-space-horizontal .arco-space-item {
  margin-bottom: 0 !important;
}
</style>
